<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="expires" content="no-cache">
<title>Insert title here</title>
<%
	//防止浏览器产生缓存
	response.setHeader("Pragma","No-Cache"); 
	response.setHeader("Cache-Control","No-Cache"); 
	response.setDateHeader("Expires", 0); 

	//定义基础路径，从DispatcherServlet获取数据
	String path = request.getContextPath() + "/";	
	String resourcesPath = path + "resources/";
	String omPath = resourcesPath + "operamasks-ui-2.0/";		
	
%>
<link href="<%=omPath%>css/default/om-default.css" rel="stylesheet"	type="text/css" />
<script src="<%=omPath%>js/jquery.min.js" type="text/javascript"></script>
<script src="<%=path%>resources/sm/js/jquery.xml2json.js" type="text/javascript"></script>
<script src="<%=omPath%>js/operamasks-ui.min.js" type="text/javascript"></script>
<script src="<%=path%>resources/sm/js/om-dialog-url.js" type="text/javascript"></script>
<style type="text/css">
	.search-button{
	padding-left: 30px;
	padding-top: 9px;
	}
	
   	.myinput input{
    border:1px solid;
    border-color:lightblue;
    height: 18px;
    width : 160px;
   	}
   	.myinput input:focus{border: 1px solid #3A76C2;}
 	input.error{border: 1px solid red;}
   .mytable .mytable-left{
   text-align: right;
   width : 100px;
   }
  .mytable .mytable-right{
   width : 150px;
   }
</style>
<script type="text/javascript">
//集中获取ModelAndView数据
var path = "${pageContext.request.contextPath}" + "/";
var dialogDoUrl = "${dialogDoUrl}";
var dialogDoName = "${dialogDoName}";

var searchPanel = null;
var searchField = null;
var searchButton = null;
var maintTool = null;
var grid = null;
var dialogAdd = null;
var dialogEdit = null;
var dialogDelete = null;
var dialogView = null;
var inputHelper = null;
var divInputChooser = null;
var validatorAdd = null;
var validatorEdit = null;

//设置表格操作提交的网址
var searchUrl = path + "rm/filterQuery.html";
var addUrl = path + "rm/gridAdd.html";
var deleteUrl = path + "rm/gridDelete.html";
var editUrl = path + "rm/gridEdit.html";

$(function(){
	initVar();
	initLayout();
	initSearchPanel();
	initGrid();
	initComponent();
	initDialog();
	loadInputHelperButton();
	search();
});

function initVar(){
	maintool = $("#maintool");
	searchPanel = $("#search-panel");
	searchField = $("#search-field");
	searchButton = $("#search-button");
	grid = $("#mainGrid");
	dialogAdd = $("#dialog-Add");
	dialogDelete = $("#dialog-Delete");
	dialogEdit = $("#dialog-Edit");
	dialogView = $("#dialog-View");
	inputHelper = $('#inputHelper');
	divInputChooser = $('#divInputChooser');
}
function initLayout(){
	$('#page').omBorderLayout({
		panels : [ {
			id : "center-panel",
			header : false,
			region : "center",
			resizable : true,
		}],
	});
	searchPanel.omPanel({
		title : "搜索",
		collapsible : true,
		height : 120
	});
}
function initSearchPanel(){
	$(':input',searchField).each(function() {
		$(this).keyup(function(event) {
			if (event.keyCode == 13) {
				search();
			}
		});
	});
	searchButton.omButton({
		icons:{left : path + 'resources/sm/images/search.png'},
		width:70,
		onClick:function(){
			search();
		}
	});
}
function initGrid(){
	grid.omGrid({
		limit : 30,
		title : '料仓数据',
		singleSelect : false,
		height:540,
		colModel : [
				{header : '料仓号', name : 'storageId', align : 'center', width : '70', sort:'serverSide'},
				{header : '料仓名称', name : 'storageName', align : 'center', width : '140', sort:'serverSide'},
				{header : '料仓类型', name : 'storageType', align : 'center', width : '100', sort:'serverSide'},
				{header : '料仓位置', name : 'storageLoc', align : 'center', width : '100', sort:'serverSide'},
				{header : '物料编码', name : 'materialId', align : 'center', width : '130', sort:'serverSide'},
				{header : '物料描述', name : 'materialDesc', align : 'center', width : '160', sort:'serverSide'},
				{header : '料仓容量(KG)', name : 'volume', align : 'center', width : '160', sort:'serverSide'},
		            ],
	});
}
function initComponent(){
	$('#queryStorageType').omCombo({
		dataSource : [ {
			text : '高位料仓',
			value : 'B'
		}, {
			text : '高位料仓-手投',
			value : 'M'
		} , {
			text : '高位料仓-丝线',
			value : 'W'
		} , {
			text : '低位料仓-合金中间仓',
			value : 'ALLOY'
		} , {
			text : '低位料仓-镍库',
			value : 'NI'
		}, {
			text : '低位料仓-手投',
			value : 'MANUAL'
		}, {
			text : '低位料仓-丝线',
			value : 'WIRE'
		} ],
		width : 163,
	});
	
	$('#storageType',addForm).omCombo({
		dataSource : [ {
			text : '高位料仓',
			value : 'B'
		}, {
			text : '高位料仓-手投',
			value : 'M'
		} , {
			text : '高位料仓-丝线',
			value : 'W'
		} , {
			text : '合金中间仓',
			value : 'U-ALLOY'
		} , {
			text : '镍库',
			value : 'U-NI'
		}, {
			text : '低位料仓-手投',
			value : 'U-MANUAL'
		}, {
			text : '低位料仓-丝线',
			value : 'U-WIRE'
		} ],
		width : 163,
		onValueChange:function(target,newValue,oldValue,event){
			if(newValue == 'B' || newValue == 'W' || newValue == 'M'){
				$('#storageLoc',addForm).val(newValue);
				$('#storageLoc',addForm).removeAttr('readonly');
			}
			else{
				$('#storageLoc',addForm).attr('readonly','readonly');
				$('#storageLoc',addForm).val(newValue.replace('U-',''));
			}
		 }
	});
	var buttons = [];
	buttons.push({
		id : "add",
		label : "增加",
		onClick : function(){
			var selections = grid.omGrid('getSelections', true);
			if(selections ==null || selections.length<1){
				showDialogAdd('新增', null);
			}else{
				showDialogAdd('新增', selections[0]);
			}
		}
	});
	buttons.push({separtor : true});
	buttons.push({
		id : "delete",
		label : "删除",
		onClick : function(){
			var selections = grid.omGrid('getSelections', true);
			if (selections.length < 1) {
				$.omMessageBox.alert({
					content : '请至少选择一行记录！',
				});
				return false;
			}else if (selections.length == 1) {
				showDialogDelete('删除', selections[0]);
			}else {
				$.omMessageBox.confirm(
						{
							title: "提示",
							content: "确定要删除选中记录?",
							onClose: function( value )
							{
								if( value ) gridDelete( selections );
							}
						});
			}
			
		}
	});
	buttons.push({separtor : true});
	buttons.push({
		id : "edit",
		label : "修改",
		onClick : function(){
			var selections = grid.omGrid('getSelections', true);
			if (selections.length != 1) {
				$.omMessageBox.alert({
					content : '请选择一行记录！',
				});
				return false;
			}
			showDialogEdit('修改', selections[0]);
		}
	});
	
	maintool.omButtonbar({btns:buttons});
	
	$('#storageId',addForm).focus(function (){
		$('#storageId',addForm).css({
			border: "1px solid #3A76C2"
		});
	});
	$('#storageId',addForm).blur(function (){
		validateName(0);
	});
}

function gridDelete(rows){
	var params = "";
	
	for( var i=0; i<rows.length; i++ )
	{
		var rowData = rows[i];
		if(i!=0){
			params += ( ","+rowData["storageId"]);
		}else{
			params += ( rowData["storageId"]);
		}
	}
	if( params.length > 0)
	{
		var info = {
				"domain" : "SmRmStorage",
				"ids" : params
		};
		$.post( deleteUrl,info,
				function(data, textStatus)
				{
			     if( data.success )
					{
			    	 	$.omMessageBox.alert( { type: "success", title:"删除成功", content: data.message } );
			    	 	grid.omGrid( "reload" );
					}
			     else
			    	 {
						$.omMessageBox.alert( { type: "error", title:"删除失败", content: data.message } );
			    	 }						
				}
				, "json" 
				);
	}
}

function search()
{	
	var rules =[], i=0;
	$(':input',searchField).each(function() {
		if($.trim(this.name)!="")
			if( $(this).val() != null &&  $.trim($(this).val()) != "" 
					&& typeof($(this).attr('op')) != "undefined" && typeof($(this).attr('ty')) != "undefined")
				rules[i++] = {op : $(this).attr('op'), field : $(this).attr('name'), value : $(this).val(), type : $(this).attr('ty')};
	});
	var newValue = $('#queryStorageType',searchField).val();
	if(newValue!='' && newValue != 'B' && newValue != 'W' && newValue != 'M'){
		rules[i++] = {op : 'equal', field : 'storageLoc', value : $('#queryStorageType').val(), type : 'string'};
		rules[0] = {op : 'equal', field : 'storageType', value : 'U', type : 'string'};
	}
	var group ={
			op : "and",
			rules : rules
	};
	var extraData = {
			"domain" : "SmRmStorage",
			"rules" : i==0?null:JSON.stringify(group),
	};
	grid.omGrid({
		dataSource : searchUrl,
		extraData : extraData, 
		method:'POST'
	}, 'reload');
	
}

function  validateName(fog){
	var group ={
			op : "and",
			rules : [{op : 'equal', field : 'storageId', value : $('#storageId',addForm).val(), type : 'string'}]
	};
	var extraData = {
			"domain" : "SmRmStorage",
			"rules" : JSON.stringify(group),
	};
	$.post( searchUrl,extraData, 
			function(data, textStatus)
			{	
				if(data.total > 0){
					$('#storageId',addForm).css({
						border: "1px solid red"
					});
				 }else if(fog!=0){
					addStock();
				 }
	},'json');
}

function addStock(){
	if(validatorAdd.form()){
		var info = {
				"domain" : "SmRmStorage",
				"SmRmStorage" : getSubmitData(dialogAdd)
		};
		$.post( addUrl,info, 
				function(data, textStatus)
				{
					$(':input',addForm).each(function(){
						if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
						$(this).omTooltip('hide');
					}
			});
			     if( data.success )
					{
			    	 $.omMessageBox.alert( { type: "success", title:"成功", content: data.message } );
			    	 dialogAdd.omDialog("close");
					 grid.omGrid('reload');
					 
					}
			     else
			    	 {
						$.omMessageBox.alert( { type: "error", title:"失败", content: data.message } );
			    	 }
		});
	}else{
		$(':input',addForm).each(function(){
			if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
				$(this).omTooltip('show');
			}
		});
	}
}

function initDialogAdd() {
	$('#volume',addForm).omNumberField({allowDecimals : true});
	var buttons = [
			{
				text : "增加",
				click : function() {
					validateName();
				}
			}, {
				text : "关闭",
				click : function() {
					$(':input',addForm).each(function(){
						if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
							$(this).omTooltip('hide');
						}
					});
					dialogAdd.omDialog("close");// 关闭dialog
					grid.omGrid('reload');// 刷新表格数据
				}
			} ];
	dialogAdd.omDialog({
		width : 700,
		height : 250,
		autoOpen : false,
		modal : true,
		resizable : false,
		buttons : buttons,
		onClose : function(){
			$(':input',addForm).each(function(){
				if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
					$(this).omTooltip('hide');
				}
			});
		}
	});

	// 显示dialog并初始化里面的输入框的数据
	showDialogAdd = function(title, rowData) {
		validatorAdd.resetForm();
		if(rowData != null){
			$('#addForm input').each(function(){
				$(this,showDialogAdd).val(rowData[this.name]);
			});
		}
		dialogAdd.omDialog("option", "title", title);
		dialogAdd.omDialog("open");// 显示dialog
	};

};

// 声明dialogDelete对话框
function initDialogDelete() {
	var buttons = [
			{
				text : "删除",
				click : function() {
					var info = {
							"domain" : "SmRmStorage",
							"ids" : $('#storageId',deleteForm).val()
					};
					$.post( deleteUrl,info, 
							function(data, textStatus)
							{
						     if( data.success )
								{
						    	 $.omMessageBox.alert( { type: "success", title:"成功", content: data.message } );
						    	 dialogDelete.omDialog("close");// 关闭收货对话框
								 grid.omGrid('reload');// 刷新表格数据
								 
								}
						     else
						    	 {
									$.omMessageBox.alert( { type: "error", title:"失败", content: data.message } );
						    	 }
					});
				}
			}, {
				text : "关闭",
				click : function() {
					dialogDelete.omDialog("close");// 关闭dialog
					grid.omGrid('reload');// 刷新表格数据
				}
			} ];
	dialogDelete.omDialog({
		width : 700,
		height : 250,
		autoOpen : false,
		modal : true,
		resizable : false,
		buttons : buttons
	});
	// 显示dialog并初始化里面的输入框的数据
	showDialogDelete = function(title, rowData) {
		$('#deleteForm input').each(function(){
	    	$(this,showDialogDelete).val(rowData[this.name]);
		});
		dialogDelete.omDialog("option", "title", title);
		dialogDelete.omDialog("open");// 显示dialog
	};

};

// 声明dialogEdit对话框
function initDialogEdit() {
	$('#volume',editForm).omNumberField({allowDecimals : true});
	var buttons = [
			{
				text : "修改",
				click : function() {
					if(!validatorEdit.form()){
						$(':input',editForm).each(function(){
							if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
								$(this).omTooltip('show');
							}
						});
						return;
					}
					var info = {
							"domain" : "SmRmStorage",
							"SmRmStorage" : getSubmitData(dialogEdit)
					};
					$.post( editUrl,info, 
							function(data, textStatus)
							{
						     if( data.success )
								{
						    	 $.omMessageBox.alert( { type: "success", title:"成功", content: data.message } );
						    	 dialogEdit.omDialog("close");// 关闭收货对话框
								 grid.omGrid('reload');// 刷新表格数据
								 
								}
						     else
						    	 {
									$.omMessageBox.alert( { type: "error", title:"失败", content: data.message } );
						    	 }
					});
				}
			}, {
				text : "关闭",
				click : function() {
					$(':input',editForm).each(function(){
						if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
							$(this).omTooltip('hide');
						}
					});
					dialogEdit.omDialog("close");// 关闭dialog
					grid.omGrid('reload');// 刷新表格数据
				}
			} ];
	dialogEdit.omDialog({
		width : 700,
		height : 250,
		autoOpen : false,
		modal : true,
		resizable : false,
		buttons : buttons,
		onClose : function(){
			$(':input',editForm).each(function(){
				if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
					$(this).omTooltip('hide');
				}
			});
		}
	});
	// 显示dialog并初始化里面的输入框的数据
	showDialogEdit = function(title, rowData) {
		validatorEdit.resetForm();
		$('#editForm input').each(function(){
	    	$(this,showDialogEdit).val(rowData[this.name]);
		});
		dialogEdit.omDialog("option", "title", title);
		dialogEdit.omDialog("open");// 显示dialog
	};

}
function getSubmitData(form){
	var info = {};
	$(':input',form).each(function(){
		if(typeof($(this).attr('id')) != "undefined" && typeof($(this).attr('name')) != "undefined"){
			info[$(this).attr('id')] = $(this).val();
		}
	});
	return JSON.stringify(info);
}
function initDialog(){
	initDialogAdd();
	initDialogDelete();
	initDialogEdit();
	validateAddInit();
	validateEditInit();
};

function loadInputHelperButton(){
	
	var selectUrl = path + "sm/select-input.html?jspName=sm/newRm/matChooser";
	var frameId = "AnaInput";
	var buttons = [ {
		text : "关闭",
		click : function() {
			divInputChooser.omDialog("close");// 关闭dialog
		}
	} ];
	divInputChooser.omDialog({
		width : 600,
		height : 470,
		autoOpen : false,
		modal : true,
		resizable : false,
		targetmode : "iframe",
		name : frameId,
		url : selectUrl,
		buttons : buttons,
	});

	$('#materialId',addForm).keydown(function(e){
        if(e.keyCode==118){ //如果按的键是F7
        	inputHelper.omButton('click');
            return false;
        }else{
            return false; 
        }
    });
	
	$('#materialId',editForm).keydown(function(e){
        if(e.keyCode==118){ //如果按的键是F7
        	$('#inputHelper',editForm).omButton('click');
            return false;
        }else{
            return false; 
        }
    });
	
	inputHelper.omButton({
		width : 35,
		id : "inputHelperBtn",
		onClick : function(event){
			divInputChooser.omDialog("option", "title", "选择（双击记录即可选择）");
			divInputChooser.omDialog("open");// 显示dialog
			var childWindow = document.getElementById(frameId).contentWindow;
			childWindow.initForm(addForm);
			childWindow.search();
        }
	});
	$('#inputHelper',editForm).omButton({
		width : 35,
		id : "inputHelperBtn",
		onClick : function(event){
			divInputChooser.omDialog("option", "title", "选择（双击记录即可选择）");
			divInputChooser.omDialog("open");// 显示dialog
			var childWindow = document.getElementById(frameId).contentWindow;
			childWindow.initForm(editForm);
			childWindow.search();
        }
	});
	
}

function fillBackAndCloseDialog(rowData,form) {
	$("#materialId" , form).val(rowData["materialId"]);
	$("#materialDesc", form).val(rowData["materialDesc"]);
	divInputChooser.omDialog("close");
};

function validateAddInit()
{ 
	validatorAdd = $(addForm).validate(
			{
				//编写验证规则
				rules: {
					storageId: { required: true },
					storageType: { required: true },
					volume: { required: true, digits: true },
					},
				messages: {
					storageId: { required: "" },
					storageType: { required: "" },
					volume: { required: "" },
					},
			});
	
	$('#storageId',addForm).omTooltip({
		  region : 'right',
       html : '不能为空,且长度 不超过8！',
       anchor : true ,
       offset : [-5,5]
	});
	$('#storageLoc',addForm).omTooltip({
		  region : 'right',
     html : '不能为空,长度不超过3！',
     anchor : true ,
     offset : [-5,5]
	});
	$('#storageName',addForm).omTooltip({
		  region : 'right',
		   html : '长度不超过20！',
		   anchor : true ,
		   offset : [-5,5]
	});
	$('#volume',addForm).omTooltip({region : 'right', html : '非空，必须为数字,长度不超过6！', anchor : true , offset : [-5,5]});
	
}

function validateEditInit()
{ 
	validatorEdit = $(editForm).validate(
			{
				//编写验证规则
				rules: {
					volume: { required: true, digits: true },
					},
				messages: {
					volume: { required: "" },
					},
			});
	
	$('#storageLoc',editForm).omTooltip({
		  region : 'right',
     html : '不能为空,长度不超过3！',
     anchor : true ,
     offset : [-5,5]
	});
	$('#storageName',editForm).omTooltip({
		  region : 'right',
		   html : '长度不超过20！',
		   anchor : true ,
		   offset : [-5,5]
	});
	$('#volume',editForm).omTooltip({region : 'right', html : '非空，必须为数字,长度不超过6！', anchor : true , offset : [-5,5]});
	
}
</script>
</head>
<body>
	<div id="page" style="height:690px;">
		<div id="center-panel" >
			<div id="search-panel" > 
				<div id="search-field">
					<table id="searchTable" class="mytable">
						<tr>
							<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓类型：</font></span></td>
							<td class="mytable-right"><span class="myinput"><input id="queryStorageType" name="storageType" op="equal" ty="string" type="text"/></span></td>
							<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓编号：</font></span></td>
							<td class="mytable-right"><span class="myinput"><input id="queryStorageId" name="storageId" op="startwith" ty="string" type="text" /></span></td>
							<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料编码:</font></span></td>
							<td class="mytable-right"><span class="myinput"><input id="queryMaterialId" name="materialId" op="startwith" ty="string" type="text" /></span></td>
							<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料描述:</font></span></td>
							<td class="mytable-right"><span class="myinput"><input id="queryMaterialDesc" name="materialDesc" op="like" ty="string" type="text" /></span></td>
						</tr>
					</table>
				</div>		
				<div class="search-button"><span id="search-button">搜索</span></div>				
			</div>	
			<div id="maintool"></div>
			<table id="mainGrid"></table>
		</div>
	</div>	
<div id="dialog-Add">	
		<form id="addForm">
		<table class="mytable">
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓编号:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageId" name="storageId" type="text" maxlength="8"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓名称:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageName" name="storageName" type="text" maxlength="20"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料编码:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialId" name="materialId" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料描述:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialDesc" name="materialDesc" type="text" readonly="readonly"/></span></td>
				<td><button id='inputHelper' value="浏览"></button></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓类型:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageType" name="storageType" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓容量(KG):</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="volume" name="volume" type="text" maxlength="6"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓位置:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageLoc" name="storageLoc" type="text" /></span></td>
			</tr>
		</table>
		</form>	
	</div>
	<div id="dialog-Delete">
		<form id="deleteForm">
		<table class="mytable">
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓编号:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageId" name="storageId" type="text" maxlength="8" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓名称:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageName" name="storageName" type="text" maxlength="20" readonly="readonly"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料编码:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialId" name="materialId" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料描述:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialDesc" name="materialDesc" type="text" readonly="readonly"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓类型:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageType" name="storageType" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓容量(KG):</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="volume" name="volume" type="text" maxlength="6" readonly="readonly"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓位置:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageLoc" name="storageLoc" type="text" readonly="readonly"/></span></td>
			</tr>
		</table>
		</form>
	</div>
	<div id="dialog-Edit">	
		<form id="editForm">
		<table class="mytable">
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓编号:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageId" name="storageId" type="text" maxlength="8" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓名称:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageName" name="storageName" type="text" maxlength="20"/></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料编码:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialId" name="materialId" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">物料描述:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="materialDesc" name="materialDesc" type="text" readonly="readonly"/></span></td>
				<td><button id='inputHelper' value="浏览"></button></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓类型:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageType" name="storageType" type="text" readonly="readonly"/></span></td>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓容量(KG):</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="volume" name="volume" type="text" maxlength="6" /></span></td>
			</tr>
			<tr>
				<td class="mytable-left"><span><font face="微软雅黑" size="2px" color="darkblue">料仓位置:</font></span></td>
				<td class="mytable-right"><span class="myinput"><input id="storageLoc" name="storageLoc" type="text" /></span></td>
			</tr>
		</table>
		</form>	
	</div>
	<div id="dialog-View">	</div>
	<div id = "divInputChooser"></div>
</body>
</html>